import {forwardRef} from 'react'
const Button =forwardRef(function Button ({ children,onClick,active,onMouseEnter,onMouseLeave,onPointerEnter,onPointerLeave,onFocus }, ref) {
    return (<div 
        ref={ref}
        className="button p-3 pb-2"
        onClick={onClick}
        onMouseEnter={onMouseEnter}
        onMouseLeave={onMouseLeave}
        onPointerEnter={onPointerEnter}
        onPointerLeave={onPointerLeave}
        onFocus={onFocus}
    >
        <div className={`${active?'border-orange-300':'border-transparent'} border-solid border-b-4`}>
            {children}
        </div>
    </div>)
})
export default Button